import React, { Component } from './react';
import ReactDOM from 'react-dom';
class Child extends Component {
    render() {
        const mappedChildren = React.Children.map(
            this.props.children,
            function (item, index) {
                // console.log(item);
                return [item, [item, [item, [item]]]];
            },
            { name: '我是上下文' }
        );
        console.log(mappedChildren);
        return <div id="io">{mappedChildren}</div>;
    }
}
class App extends Component {
    render() {
        return (
            <Child>
                {[<span>a</span>, <span>B</span>]}
                {[<span>c</span>, <span>D</span>]}
            </Child>
        );
    }
}
// class App extends Component {
//     static defaultProps = {
//         name: 'app',
//     };
//     render() {
//         /** createElemnt 的返回值
//          * $$typeof: symbol; 标记 react 元素类型，  可以防止xss 攻击    为了防止后台数据有恶意的虚拟dom 类型，后台没事symbol
//          * type: any; 是类名字
//          * key: any; 区分child  的标识
//          * ref: any;
//          * props: any;
//          * _owner: any;
//          * _self: any;
//          * _source: any;
//          */
//         let returnElement = React.createElement(
//             'div',
//             {},
//             React.createElement('p', {}, '1'),
//             React.createElement('button', {}, '1')
//         );
//         console.log(returnElement);
//         return returnElement;
//     }
// }

/**
 * key 的规律
 * {$$typeof: symbol(react.elemnt), type: "span", key: '.1.1/.1:1:1:0', ref:null,props:{}}
 */
let element = React.createElement(App, { title: 'hai' });
// console.log('App.prototype.isReactComponent', App.prototype.isReactComponent);
ReactDOM.render(element, document.getElementById('root'));
